<template>
<div>
    <h2 style="text-align: center;">用户投资赎回列表</h2>
    <table class="table table-bordered">
        <thead>
            <tr style="background-color: aqua;">
                <td>投资项目编号</td>
                <td>账户名称</td>
                <td>投资项目总金额</td>
                <td>用户已投金额</td>
                <td>赎回金额</td>
            </tr>
        </thead>
    
        <tbody>
            <tr v-for="item in info">
                <td>{{ item.I_Id }}</td>
                <td>{{ item.UL_Name }}</td>
                <td>{{ item.I_Budget }}</td>
                <td>{{ item.UI_Money }}</td>
                <td>{{ item.UTR_Money }}</td>
            </tr>
        </tbody>
    </table>
</div>
</template>

<script setup lang="ts">
import {useRoute} from 'vue-router';
import {ref,onMounted} from 'vue';
import axios from 'axios';

//创建路由操作对象
const route=useRoute();

//创建响应式数据
const info=ref([{
    I_Id:0,
    I_Budget:0,
    UI_Money:0,
    UL_Name:"",
    UTR_Money:0
}])

//创建生命周期函数钩子
onMounted(()=>{
    LoadData();
})

//完成数据加载功能
const LoadData=()=>{
    axios.get("https://localhost:44321/api/Invest/GetAllUserInvestRedeemInfo",
        {
            params:{
                Iid:route.params.Iid
            }
        }
    )
    .then(res=>{
        console.log(res.data)
        info.value=res.data
    })
}
</script>